User blog:King Dragonhoff/Editing/Tags
Tags are bits of code that look like this: Tags almost always come in pairs. A pair has a "start" tag and an "end" tag. The "end" tag has a forward slash right after the less-than sign. The tags' content comes between the tags. Here is an example of a pair of tags with some content. CONTENT Element Styling Tags are used to change their contents in certain ways. HTML tags do this using styles, classes, and ID's. You can read about classes and ID's in my Classes and IDs guide. Styles can do almost anything that you can do with classes and ID's, but styles do not need a CSS file which only admins can edit. You can add styles to an HTML element (a set of HTML tags and their contents) like this: CONTENTS You would then make changes to the element by adding CSS properties to the element. For example, the following element results in red text. Text Result: Text Properties are added between the quotation marks after the "style" statement. Properties consist of a property name, followed by a colon, then the keyword, and end with a semi-colon. Semi-colons mark the end of a property, so they separate properties from each other. Example: Text Result: Text If you are interested in learning more CSS properties, visit this reference. Tags can also be placed inside other tag pairs. In the following example, two span elements are nested inside a p element. Example Text Result: Example Text Since the p element contains both of the span elements, the letter-spacing property is applied to both sets of text. =Tag Types= Different tag types apply certain properties to their contents by default and/or create elements with special abilities. Below is a series of tag types that we use frequently here. Each section lists what properties are added to the element by default and gives an example usage. -span -div -p -center -br -pre -nowiki -u -i -s -b -Comment Tags span *Element is displayed in-line with text. Example: Text example Text Result: Text example Text div *A line break is added before and after the element. *Width is set to 100%. Example: Text example Text Result: Text example Text p *A line break is added before and after the element. *Some margin (empty space) is added above and below the element. *Width is set to 100%. Example: Text example Text Result: Text example Text center *All text and boxes within the tags are center aligned. Example: Text example Text Result: Text example Text br *Forces a line break. *NOTE: This element only uses one tag. Example: Example Text Result: Example Text pre *Text is changed to a fixed width font. *A gray box is placed around all text. *A line break is added before and after the element. *Some margin (empty space) is added above and below the element. *Width is set to 100%. Example Result: This text has pre tags around it. nowiki *Prevents code from rendering so that it displays as plain text. Example Result: This div has nowiki tags around it. u *Underlines all text within the element. Example: Text Result: Text i *italicizes all text within the element. Example: Text Result: Text s *Puts a strike through all text within the element. Example: Text Result: Text b *Bolds all text within the element. Example: Text Result: Text Comment Tags *All text and code that is inside is omitted from the page when it is interpreted. Example: This text will appear on the published page. This element will appear on the published page. Result: This text will appear on the published page. This element will appear on the published page. Category:Blog posts